import { useState, useEffect, useRef } from "react";
import dayjs from "dayjs";
import duration from "dayjs/plugin/duration";

dayjs.extend(duration);

//dayjs.duration 是 Day.js 库中用于处理时间跨度（如时长、间隔）的功能，它可以创建、解析和操作两个时间点之间的差值

const useMinutesDown = (initTime = 30) => {
  const timer = useRef(null); //定时器句柄
  const [formatTime, setFormatTime] = useState("00:00"); // 格式化时间
  const [isCounting, setIsCounting] = useState(false); //是否正在倒计时

  //定义开始倒计时方法
  const startMinutesDown = () => {
    //判断是是否在倒计时
    if (!isCounting) {
      setIsCounting(true); //修改状态为true，表示正在倒计时
      const endTime = dayjs().add(initTime, "minute"); //设置未来时间：当前时间+30分钟

      //开启定时器，倒计时
      timer.current = setInterval(() => {
        const curTime = dayjs(); //获取当前时间
        //计算两个时间的差值
        const diff = endTime.diff(curTime, "seconds"); //计算时间差：结束时间-当前时间

        //倒计时结束，清除定时器，状态恢复最初...
        if (diff <= 0) {
          clearInterval(timer.current);
          setFormatTime("00:00");
          setIsCounting(false);
        }

        //格式化时间
        //处理时间跨度（如时长、间隔）的功能，它可以创建、解析和操作两个时间点之间的差值
        const reTime = dayjs.duration(diff, "seconds").format("mm:ss");

        //赋值
        setFormatTime(reTime);
      }, 1000);
    }
  };

  useEffect(() => {
    return () => {
      if (timer.current) {
        clearInterval(timer.current);
      }
    };
  }, []);

  return {
    formatTime,
    isCounting,
    startMinutesDown,
  };
};

export default useMinutesDown;
